<template>
    <div>
        <!--pages/question/question.wxml-->
        <div class='wrap column'>
            <div class='wrap-item column'>
                <div class='item' v-for="(item,index) in questionList" :key="index" :id="item.mid">
                    <div class='item-right column'>
                        <div class="question flex">
                            <img src="../assets/required.png" v-if="item.REQUIREDFLAG == 1">
                            <span>Q{{index + 1}}：{{item.GROUPNAME}}({{item.SELTYPE == 0 ?'多选':'单选'}} {{item.REQUIREDFLAG == 1?'必填':''}})</span>
                        </div>
                        <div class="radio-group flex">
                            <div class="radio flex" :class="{'active':items.select == 1}" v-for="(items,key) in item.CONTENT.detail" @click='chooseTap(index,key,item.ID,item.SELTYPE)' :key="key">
                                {{items.txt}}
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class='submit flex' @click='submit'>告诉医生</div>
        </div>
        <!-- 加载中 -->
        <div class='loading column' v-if="showLoading">
            <img src='../assets/load.gif'></img>
            <p>拼命加载中...</p>
        </div>
    </div>
</template>
<script>
    import { Toast,Indicator } from "mint-ui";
    import { getInquirylist,saveInquirylist } from "./../api/index";
    export default{
        data(){
            return{
                doctorid: '',//医生id
                uid: '',//患者id
                registrationid: '',//处方id
                questionList: [],//问题列表
                showLoading: true,//加载页面变量
                scrollInto: '',//用户没有填写必填问题跳转
                outTime: 1500,
                flag:true
            }
        },
        mounted(){
            if(this.$route.params.registrationid){
                this.registrationid = this.$route.params.registrationid
                sessionStorage.setItem('registrationid',this.$route.params.registrationid)
            }else{
                this.registrationid = sessionStorage.getItem('registrationid')
            }

            if(this.$route.params.doctorid){
                this.doctorid = this.$route.params.doctorid
                sessionStorage.setItem('inquiryDoctorid',this.$route.params.doctorid)
            }else{
                this.doctorid = sessionStorage.getItem('inquiryDoctorid')
            }
            
            if(this.$route.params.uid){
                this.uid = this.$route.params.uid
                sessionStorage.setItem('inquiryUid',this.$route.params.uid)
            }else{
                this.uid = sessionStorage.getItem('inquiryUid')
            }
            this.getInquirylistTap()
        },
        methods:{
            //获取问题列表
            getInquirylistTap(){
                let mstr = sessionStorage.getItem('mstr')
                getInquirylist(mstr,this.uid,this.doctorid).then((res)=>{
                    if(res.data.status === 1){
                        let len = res.data.data.length
                        for (let i = 0; i < len; i++) {
                            res.data.data[i].mid = `id${res.data.data[i].ID}`
                            let len2 = res.data.data[i].CONTENT.detail.length
                            for (let j = 0; j < len2; j++) {
                                res.data.data[i].CONTENT.detail[j].select = 0
                            }
                        }
                        this.questionList = res.data.data
                    }else{
                        this.questionList = []
                    }
                    this.showLoading = false
                })
            },
            //选择
            chooseTap(index,key,id,seltype){
                //多选题
                if (seltype == 0) {
                    if (this.questionList[index].CONTENT.detail[key].select === 0) {
                        this.questionList[index].CONTENT.detail[key].select = 1
                    } else {
                        this.questionList[index].CONTENT.detail[key].select = 0
                    }
                } else {
                    //单选题
                    for (let j = 0; j < this.questionList[index].CONTENT.detail.length; j++) {
                        this.questionList[index].CONTENT.detail[j].select = 0
                    }
                    this.questionList[index].CONTENT.detail[key].select = 1
                }
            },
            //提交列表
            submit(){
                //提交的参数
                let data = {
                    mstr: sessionStorage.getItem('mstr'),
                    doctorid: this.doctorid,
                    patientid: this.uid,
                    registrationid: this.registrationid,
                    from: []
                }
                let len = this.questionList.length
                //判断用户是否填写必填问题
                for (let i = 0; i < len; i++) {
                    if (this.questionList[i].REQUIREDFLAG == 1) {
                        let flag = true
                        let len2 = this.questionList[i].CONTENT.detail.length
                        for (let j = 0; j < len2; j++) {
                            if (this.questionList[i].CONTENT.detail[j].select == 1) {
                                flag = false
                            }
                        }
                        if (flag) {
                            let container = this.$el.querySelector("#" + this.questionList[i].mid);
                            container.scrollIntoView();
                            Toast({
                                message: `请填写第${i + 1}题`,
                                position:'center',
                                duration: 2000
                            })
                            return false;
                        }
                    }
                }
                //提交数据
                for (let i = 0; i < len; i++) {
                    let len2 = this.questionList[i].CONTENT.detail.length
                    let selected = []
                    let content = []
                    let detail = this.questionList[i].GROUPNAME
                    for (let j = 0; j < len2; j++) {
                        content.push({
                            txt: `${this.questionList[i].CONTENT.detail[j].txt}`,
                            selected: this.questionList[i].CONTENT.detail[j].select
                        })
                        if (this.questionList[i].CONTENT.detail[j].select == 1) {
                            selected.push(`${this.questionList[i].CONTENT.detail[j].txt}`)
                        }
                    }
                    data.from.push({
                        INQUIRYID: this.questionList[i].ID,
                        selected: selected,
                        content: content,
                        detail: detail
                    })
                }
                if(this.flag){
                    this.flag = false
                    Indicator.open("提交中");
                    saveInquirylist(data).then((res)=>{
                        if(res.data.status === 1){
                            let inquiryData = {
                                inquiryid: res.data.data.id,
                                status: 'success'
                            }
                            sessionStorage.setItem('inquiryData',JSON.stringify(inquiryData))
                            setTimeout(()=>{
                                this.$router.replace({
                                    path:'reword'
                                })
                            },this.outTime)
                        }else{
                            Toast({
                                message:res.data.info,
                                position:'center',
                                duration:2000
                            })
                        }
                        Indicator.close();
                        setTimeout(()=>{
                            this.flag = true
                        },this.outTime)
                    })
                }
            }
        }
    }
</script>
<style lang="scss" scoped>
@import "../base/css/_base.scss";
.wrap{
    padding: 0 0 torem(50px) 0;
}
.wrap-item{
    margin-bottom: torem(50px);
    padding: torem(50px) 0 0 0;
    align-items: center;
}
.wrap-item .item{
    align-items: center;
    width: torem(690px);
    border-radius: torem(10px);
    font-size: torem(28px);
    color: #333;
    margin:0 torem(30px) torem(50px);
}
.item .question{
    align-items: center;
}
.item .question img{
    width: torem(16px);
    height: torem(19px);
    margin-right: torem(10px);
}
.item .item-right{
    flex: 1;
}
.item .radio-group{
    margin-top: torem(33px);
    flex: 1;
    display: flex;
    font-size: torem(28px);
    background: #fff;
    padding: torem(30px);
    border-radius: torem(10px);
    flex-wrap: wrap;
    justify-content: space-between;
}

.radio-group .radio{
    margin-bottom: torem(20px);
    border-radius: torem(4px);
	border: solid 1px #d55940;
    color: #333333;
    font-size: torem(26px);
    padding: torem(12px) torem(22px);
    min-width: 46%;
}
.radio-group .radio.active{
    background: #d55940;
    color: #fff;
}
.submit{
    width: 100%;
	height: torem(80px);
	background-color: #d55940;
    align-items: center;
    justify-content: center;
    color: #ffffff;
    position: fixed;
    left: 0;
    bottom: 0;
    font-size: torem(30px);
}
</style>